import React, { Component } from "react";
import {
  TouchableOpacity,
  Dimensions,
  View,
  Text,
  Platform,
  StatusBar,
  Image,
} from "react-native";
import back from "assets/images/back.png";
import Icon from "../../Iconfont";

const { width } = Dimensions.get("window");

class Back extends Component {
  localOnClick = () => {
    const { nav } = this.props;
    const { backPath = "Find", pathData } = nav.state.params || {};
    // console.log(nav.state.params); // eslint-disable-line
    nav.navigate(backPath, pathData);
  };

  render() {
    const { nav } = this.props;
    const { title = "" } = nav.state.params || {};
    return (
      <View
        style={{
          height: 30,
          width,
          flexDirection: "row",
          justifyContent: "space-between",
          alignItems: "center",
          // paddingLeft: 10,
        }}
      >
        {Platform.OS === "android" ? (
          <StatusBar
            backgroundColor="rgb(255,255,255)"
            barStyle="dark-content"
          />
        ) : null}
        <TouchableOpacity onPress={this.localOnClick}>
          {Platform.OS === "ios" ? (
            <Icon
              type="icon"
              name="iconicback"
              style={{ fontSize: 22, color: "rgb(48, 124, 246)" }}
            />
          ) : (
            <Image
              source={back}
              style={{ width: 24, height: 24, marginLeft: 18 }}
            />
          )}
        </TouchableOpacity>
        <View
          style={{
            width: 200,
            alignItems: "center",
          }}
        >
          <Text
            style={{
              fontSize: 20,
              fontWeight: "500",
              fontFamily: "PingFang SC",
            }}
          >
            {title}
          </Text>
        </View>
        <View>
          <Icon
            type="icon"
            name="iconicback"
            style={{ fontSize: 22, color: "rgba(48, 124, 246, 0)" }}
          />
        </View>
      </View>
    );
  }
}

export default Back;
